<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>详情</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <!--<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">-->
    <link href="/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
    <!-- 可选的Bootstrap主题文件（一般不用引入） -->
    <!--<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap-theme.min.css">-->
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <!--<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>-->
    <script src="/js/jquery-1.8.3.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <!--<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>-->
    <script src="/js/bootstrap-3.1.1.min.js"></script>
    <link rel="stylesheet" href="/css/jquery.skidder.css">
    <link rel="stylesheet" href="/stylesheets/xiuxiu.css">
</head>
<body style="background-color: #e3e3e3">
<%include back-top.html%>
<%include nav.html%>
    <div class="bussiness_details_container">
        <!--模态窗-->
        <div class="modal fade" id="contact">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title">联系我</h4>
                    </div>
                    <div class="modal-body">
                        <p>手机号：<%=res[0].tel%></p>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <nav class="business_nav">
            <%=res[0].shop_name%>
        </nav>
        <div class="details">
            <div class="slideshow" >
                <div class="slide"><img src="/images/jy1.JPG"></div>
                <div class="slide"><img src="/images/jy2.JPG"></div>
                <div class="slide"><img src="/images/jy3.JPG"></div>
                <div class="slide"><img src="/images/jy4.JPG"></div>
                <div class="slide"><img src="/images/jy5.JPG"></div>
            </div>
            <div class="bussiness_info">
                <div class="pic1" style="padding-top: 10px">
                    <div><img src="/images/c3.jpg" alt="" class="big_icon" ></div>
                    <div><%=res[0].username%></div>
                </div>
                <div class="pic1">
                    <a href="#" class="follow"  data-toggle="modal" data-target="#contact">联系他</a>
                </div>
                <div class="pic1">
                    <a href="/users/buy" class="follow">预约寄养</a>
                </div>
                <!--<div class="pic1">-->
                    <!--<a href="#" class="follow">关注</a>-->
                <!--</div>-->
            </div>
            <div class="s_title">
               <p> 服务</p>
            </div>
            <div class="s_content" id="service">
                <div class="s1">猫:￥<span><%=res[0].cat_service%></span></div>
                <div class="s1">狗:￥<span><%=res[0].dog_service%></span></div>
                <div class="s1">仓鼠:￥<span><%=res[0].mouse_service%></span></div>
            </div>
            <div class="s_title">
                <p>小区环境</p>
            </div>
            <div class="s_content">
                <div class="s1">小区公园</div>
                <div class="s1">公交便利</div>
                <div class="s1">封闭阳台</div>
                <div class="s1">公寓</div>
            </div>
            <div class="s_title">
                <p>寄养家庭简介</p>
            </div>
            <div class="s_content">
                <textarea>
                    <%=res[0].shopcontent%>
                </textarea>
            </div>
            <div class="s_title">
                <p id="evaluate_h" style="cursor: pointer">评价>></p>
            </div>
            <div class="s_content" id="evaluate_c" style="display: none">
                <div class="evaluate_list">
                    <div class="evaluate_user">
                        <div><img src="/images/c3.jpg" alt="" class="big_icon" ></div>
                        <div>萌小宠</div>
                    </div>
                   <div class="evaluate_content">
                       <p>还不错,狗狗照顾的很好，环境很不错！！！</p>
                   </div>
                </div>
                <div class="evaluate_list">
                    <div class="evaluate_user">
                        <div><img src="/images/c3.jpg" alt="" class="big_icon" ></div>
                        <div>逗逗很逗</div>
                    </div>
                    <div class="evaluate_content">
                        <p>照顾的很用心，很好</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
<div style="height: 50px"></div>
<%include footer.html%>
    <script src="/javascripts/lb/imagesloaded.js"></script>
    <script src="/javascripts/lb/smartresize.js"></script>
    <script src="/javascripts/lb/jquery.skidder.js"></script>
    <script type="text/javascript">
        $('.slideshow').each( function() {
            var $slideshow = $(this);
            $slideshow.imagesLoaded( function() {
                $slideshow.skidder({
                    slideClass    : '.slide',
                    animationType : 'css',
                    scaleSlides   : true,
                    maxWidth : 1300,
                    maxHeight: 500,
                    paging        : true,
                    autoPaging    : true,
                    pagingWrapper : ".skidder-pager",
                    pagingElement : ".skidder-pager-dot",
                    swiping       : true,
                    leftaligned   : false,
                    cycle         : true,
                    jumpback      : false,
                    speed         : 400,
                    autoplay      : false,
                    autoplayResume: false,
                    interval      : 4000,
                    transition    : "slide",
                    afterSliding  : function() {},
                    afterInit     : function() {}
                });
            });
        });

        $(window).smartresize(function(){
            $('.slideshow').skidder('resize');
        });

    </script>
<script>
    $(function () {
        $('#service').children('div').each(function(){
            if($(this).find('span').html()==0){
                $(this).css("display","none");
            }
        });
        $('#evaluate_h').click(function () {
            $('#evaluate_c').toggle();
        });
//        $('#contact').modal('toggle');
    })
</script>
</body>
</html>